import React, { useReducer } from 'react';

function reducer(state, action) {
    let res;
    switch (action.type) {
        case 'add':
            res = state + 1;
            break;
        case 'del':
            res = state - 1;
            break;
        default:
            res = state;
    }
    return res;
}

const TestUseReducer = function () {
    const [state, dispatch] = useReducer(reducer, 0);
    return (
        <div>
            <div>{state}</div>
            <div
                aria-hidden="true"
                className="addBtn"
                onClick={() => {
                    dispatch({ type: 'add' });
                }}
            >
                添加
            </div>
            <div
                aria-hidden="true"
                className="addBtn"
                onClick={() => {
                    dispatch({ type: 'del' });
                }}
            >
                删除
            </div>
        </div>
    );
};

export default TestUseReducer;
